import React, { lazy, Suspense } from 'react';
import { Spin } from 'antd'
import Tab from '../components/MyTabbar';
import '../App.css';
import './index.scss'
import { Redirect, Route, Switch } from 'react-router-dom'
import NotFound from './NotFound';
// 设置路由懒加载
var Home = lazy(() => import('./Index/Home'))
var Cate = lazy(() => import('./Index/Cate'))
var All = lazy(() => import('./Index/All'))
var Sale = lazy(() => import('./Index/Sale'))
var Car = lazy(() => import('./Index/Car'))
var Mine = lazy(() => import('./Index/Mine'))
class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {//初始化组件状态
    }
  }
  render() {
    return (
      <div>
        <Suspense fallback={
          <div className='example'>
            <Spin />loading...
          </div>
        }>
          <Switch>
            <Route path='/index/home' component={Home}></Route>
            <Route path='/index/cate' component={Cate}></Route>
            <Route path='/index/all' component={All}></Route>
            <Route path='/index/sale' component={Sale}></Route>
            <Route path='/index/car' component={Car}></Route>
            <Route path='/index/mine' component={Mine}></Route>
            <Redirect from='/index' to='/index/home' exact></Redirect>
            <Route path='*' component={NotFound}></Route>
          </Switch>
        </Suspense>
        <Tab />
      </div>
    );
  }
}

export default App;